<template>
  <bpm-c-subtitle :title="getLanguage('title.unpaidAggregateAmount')"
                  :isCollapse="false">
    <bpm-c-form>
      <bpm-c-block  :preadonly="true"
                    :ptitle="getLanguage('label.whBtReimburse.unpaidaggregateamount')"
                    pinputtype="number"
                    v-model="unpaidaggregateamount"/>
      <bpm-c-block  :preadonly="true"
                    :ptitle="this.getLanguage('label.whBtReimburse.chargeagainstsum')"
                    pinputtype="number"
                    v-model="chargeagainstsum"/>
    </bpm-c-form>
  </bpm-c-subtitle>
</template>

<script>
import {mapState} from 'vuex'

export default {
  name: 'bpmDLoanarea',
  data () {
    return {}
  },
  computed: {
    ...mapState(['ssc', 'lang', 'pageTypeEnum', 'pageType']),
    unpaidaggregateamount () {
      if (this.pageType === this.pageTypeEnum.draft || this.pageType === this.pageTypeEnum.approve || this.pageType === this.pageTypeEnum.view) {
        return this.ssc.reimburse.whBtReimburse.unpaidaggregateamount
      } else {
        return this.ssc.reimburse.whBtReimburseRcmSub.unpaidAggregateAmountFee
      }
    },
    chargeagainstsum () {
      if (this.pageType === this.pageTypeEnum.draft || this.pageType === this.pageTypeEnum.approve || this.pageType === this.pageTypeEnum.view) {
        return this.ssc.reimburse.whBtReimburse.chargeagainstsum
      } else {
        return this.ssc.reimburse.whBtReimburseRcmSub.chargeAgainstSumFee
      }
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>
